<template>
    <div ref="body">
        <Form :label-width="120" inline>

            <Form-item label="属地区划:">
                <area-linkage :areaCode.sync="queryParam.ywgl007"></area-linkage>
            </Form-item>
            <Form-item label="人员姓名:">
                <Input v-model="queryParam.ywgl005" placeholder="请输入人员姓名" style="width:160px"/>
            </Form-item>

            <Form-item label="证件号码:">
                <Input v-model="queryParam.ywgl006" placeholder="请输入证件号码" style="width:160px"/>
            </Form-item>

            <Form-item label="救助类型:">
                <dictSelect :sel_val='queryParam.ywgl008' dictCode="assistancetype" :bindData.sync="queryParam.ywgl008"
                            style="width: 160px"
                            placeholder="请选择救助类型" showKeys="100,101,102,200,201,202,203"/>
            </Form-item>

            <Form-item label="业务类型:">
                <dictSelect :sel_val='queryParam.ywgl003' dictCode="handletype" :bindData.sync="queryParam.ywgl003"
                            style="width: 160px"
                            placeholder="请选择业务类型" showKeys="100,200,204,212,213,214,215,216,217,300,500,501,700"/>
            </Form-item>

            <Form-item label="办理状态:">
                <dictSelect :sel_val='queryParam.status' dictCode="process_status" :bindData.sync="queryParam.status"
                            style="width: 160px"/>
            </Form-item>

            <Row class="button_row">
                <!--
                 <span style="float: left;">
                     <Button type="primary" @click="toRemind()" icon="ios-alert">业务催办</Button>
                </span>
                -->
                <span style="float: right;">
                 <Button type="primary" @click="searchQueryNew">查询</Button>
                 <Button type="primary" class="button_item_left" @click="searchResetNew">重置</Button>
                </span>
            </Row>
        </Form>

        <div class="table_div">
            <vxe-table border
                       resizable
                       row-id="id"
                       :row-key="true"
                       show-overflow="tooltip"
                       align="center"
                       header-align="center"
                       ref="xTree"
                       :loading="Loading"
                       :radio-config="{highlight: true}"
                       class="mytable-style"
                       :cell-class-name="cellClassName"
                       @cell-click="selectChange"
                       :data="tableData">
                <vxe-table-column type="radio" width="60" align="center" fixed="left"/>
                <vxe-table-column field="ywgl007_name" title="属地区划" align="center" width="220" fixed="left"/>
                <vxe-table-column field="ywgl005" title="申请人姓名" align="center" width="100" fixed="left"/>
                <vxe-table-column field="ywgl006" title="申请人证件号码" align="center" width="180" fixed="left"/>
                <vxe-table-column field="ywgl008_name" title="救助类型" align="center" width="140"/>
                <vxe-table-column field="ywgl003_name" title="业务类型" align="center" width="170"/>
                <vxe-table-column field="create_date" title="受理日期" align="center" width="130" :formatter="renderTime"/>
                <vxe-table-column field="handlestatus" title="办理状态" align="left" width="300"/>
                <vxe-table-column field="busnumber" title="受理编号" align="center" width="160"/>
                <vxe-table-column field="nowdepart" title="最新经办部门" align="center" width="140"/>
                <vxe-table-column field="money" title="救助金额" align="center" width="140"/>
                <vxe-table-column field="ssca0096_name" title="审批类型" align="center" width="140"/>
                <vxe-table-column field="startdate" title="救助开始时间" align="center" width="140" :formatter="renderTime"/>
                <vxe-table-column field="completedate" title="审批完成时间" align="center" width="140"
                                  :formatter="renderTime"/>
                <vxe-table-column title="操作" align="center" width="140" fixed="right">
                    <template #default="{row}">
                        <Button type="default" @click="searchDetail(row)">查看详情</Button>
                    </template>
                </vxe-table-column>
            </vxe-table>
            <Page :total="dataCount" :page-size="pageSize" show-total class="paging"
                  @on-change="handleTableChange" :current="pageNo"></Page>
        </div>
        <application-modal ref="modal"/>
    </div>
</template>

<script>
    import {CommonMixin} from '@/views/common/js/CommonMixin'
    import {getAction, postAction} from '@/api/request'
    import applicationModal from './applicationModal'
    import dictSelect from '@/components/dictSelect/dictSelect.vue'
    import '@/views/common/css/common.css';


    export default {
        name: "search-personmonitor-list",
        components: {dictSelect, applicationModal},
        mixins: [CommonMixin],
        data() {
            return {
                queryParam: {},
                Loading: false,
                show: false,
                selectRow: null,
                url: {
                    list: "/api/ac/subsistence/monitorService/getPersonMonitorPageList",
                    reminder: "/api/ac/subsistence/monitorService/doApproveReminderAlert",
                },
                dictList: [],
            }
        },
        methods: {
            cellClassName({row, column}) {
                if ('end' == row.status) {
                    if (column.property === 'handlestatus') {
                        return 'col-green';
                    }
                } else {
                    if (column.property === 'handlestatus') {
                        return 'col-red';
                    }
                }
            },
            selectChange({row}) {
                this.$refs.xTree.setRadioRow(row);
                this.selectRow = row;
            },
            clearRadioRowEevnt() {
                this.selectRow = null
                this.$refs.xTree.clearRadioRow()
            },
            searchQueryNew() {
                this.clearRadioRowEevnt();
                this.loadData(1);
            },
            searchResetNew() {
                this.queryParam = {}
                this.clearRadioRowEevnt();
                this.loadData(1);
            },
            loadData(arg) {
                if (arg == 1) {
                    this.pageNo = 1;
                }
                let that = this;
                that.Loading = true;
                let param = Object.assign({}, this.queryParam);
                let url = this.url.list;
                param.pageNo = this.pageNo;
                param.pageSize = this.pageSize;
                postAction(url, param).then((res) => {
                    if (res.data.errcode != 0) {
                        this.$Message.error(res.data.errmsg);
                    } else {
                        that.tableData = res.data.data.results;
                        that.dataCount = res.data.data.totalRecord;
                    }
                }).finally(() => {
                    that.Loading = false;
                })
            },
            toRemind() {
                let row = this.selectRow;
                if (this.selectRow) {
                    if (row.status == "active") {
                        let dataParam = {}
                        dataParam.ywgl005 = row.ywgl005;
                        dataParam.ywgl006 = row.ywgl006;
                        dataParam.busnumber = row.busnumber;
                        dataParam.ywgl007 = row.ywgl007;
                        dataParam.nowareaid = row.nowareaid;
                        dataParam.nowdepart = row.nowdepart;
                        dataParam.ssca0096 = row.ssca0096;
                        dataParam.ss12001Id = row.ss12001Id;
                        let url = this.url.reminder;
                        postAction(url, dataParam).then((res) => {
                            if (res.data.errcode == 9999) {
                                this.$Message.error(res.data.errmsg);
                            } else {
                                this.$Message.success(res.data.data.msg)
                            }
                        }).finally(() => {

                        })
                    } else {
                        this.$Message.error('当次业务已办结！');
                    }
                } else {
                    this.$Message.error("请选择需要催办的业务!");
                }
            },
            searchDetail(row) {
                row.processinstid = row.ywgl004;
                var width = this.$refs.body.clientWidth;
                this.$refs.modal.edit(row);
                this.$refs.modal.width = width + 40;
                this.$refs.modal.key = this.uuid();
            },
            modalFormOk() {
                this.selectRow = null;
                // 新增/修改 成功时，重载列表
                this.loadData();
            },
        },

    }
</script>

<style scoped>
    .paging {
        float: right;
        margin-top: 10px;
    }

    /deep/ .ivu-upload-list {
        display: none;
    }

    /deep/ .ivu-table-cell {
        padding-right: 0px;
        padding-left: 0px;
    }

    #statistics {
        height: 50px;
        line-height: 50px;
        width: 100%;
        color: red;
        font-size: 16px;
    }

    #statistics span {
        padding-left: 10px;
        padding-right: 10px;
    }
</style>
